<%@ page contentType="text/html; charset=UTF-8"%>
<%@ page import="java.util.*"%>
<%@ page import="com.sinodata.bsm.common.vo.Probe"%>
<%@ include file="../include/taglib.jsp"%>

<%
    response.setHeader("Cache-Control", "no-store");
	response.setHeader("Pragrma", "no-cache");
	response.setDateHeader("Expires", 0);
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>SSH2测试页面</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="pragma" content="no-cache" />
<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="expires" content="0" />
<%@ include file="../include/common.jsp"%>
<%@ include file="../include/jbox.jsp"%> 
<%@ include file="../include/table.jsp"%>

	
<style>
	.nav{
		width:99%;
		height:20px;
		border-collapse: collapse;
	}
	.nav  td{
		width:10px;
		border:1px solid gray;
		text-align: center;
		padding;0px 0px;
	}
	.nav td a{
		  outline: none;
	      star: expression(this.onFocus =   this.blur () );
	      text-decoration: none;
	      display:block;
	      min-width: 10px;
	      cursor: pointer;
	      margin:0px 0px;
	      font-weight: bold;
	}
	
	.nva_hover{
		background: #cccccc;
	}
	.nva_click{
	    background: #dfe8f9;
	}
	
	.nw_button{
		background: #dfe8f9;
		border: 1px solid #d8dadc;
		padding: 2px 4px 2px 2px;
		margin-right: 2px;
		cursor: pointer;
	}
	
	
</style>

<script type=text/javascript>
	$(function() {
		initTable();
		initNav();
	});
	
	function initTable(){
		var oTable=	$('#nwlist').dataTable({
			"bProcessing": false, 
			"bServerSide": true,
			"sServerMethod": 'POST',
			"sAjaxSource":'${pageContext.request.contextPath}/selfmainten/net-work!list.action',
			"bPaginate": false,
			"bSort": true,
			"bFilter":false,
			"bJQueryUI":false,
			"sPaginationType": "full_numbers",
			"sDom":'rt <"bottom"flpi>',
			"aoColumns":[
							{"mDataProp":"op","":"center","bSortable": false},
							{"mDataProp":"id"},
							{"mDataProp":"name","bSortable": false},
							{"mDataProp":"sysoid","bSortable": false},
							{"mDataProp":"cat","bSortable": false},
							{"mDataProp":"vendor","bSortable": false}
						], 
						 "oLanguage": {
							 "sInfo": "共 _TOTAL_ 条记录", 
								"sInfoEmpty": "没有找到记录"
						},
						"fnServerParams":function(aoData){
					    		aoData.push({'name':'alpha','value':alpha});
					    }
	     });
	}
	
	function datagrid(){
		var oTable=	$("#nwlist").dataTable();
		oTable.fnPageChange("first",true);
    }
	
	var alpha = 'A';
	function initNav(){
		$("#nav td:eq(0)").addClass("nva_click");
		$("#nav td").hover(function(){
			$(this).addClass("nva_hover");
		},function(){
			$(this).removeClass("nva_hover");
		});
		
		$("#nav td").live('click',function(){
			$(this).siblings().removeClass("nva_click");
			$(this).addClass("nva_click");
			alpha = $('a',$(this)).html();
			datagrid();
		});
	}
	
	
	function view(id){
		location.assign("${pageContext.request.contextPath}/selfmainten/net-work!view.action?id="+id);
	}
	
	
</script>

</head>
<body>
	<div style="margin:15px 0px 10px 5px;">
		<table id="nav" class="nav" >
			<tr>
				<td><a>A</a></td><td><a>B</a></td><td><a>C</a></td><td><a>D</a></td><td><a>E</a></td><td><a>F</a></td><td><a>G</a></td>
				<td><a>H</a></td><td><a>I</a></td><td><a>J</a></td><td><a>K</a></td><td><a>L</a></td><td><a>M</a></td><td><a>N</a></td>
				<td><a>O</a></td><td><a>P</a></td><td><a>Q</a></td><td><a>R</a></td><td><a>S</a></td><td><a>T</a></td>
				<td><a>U</a></td><td><a>V</a></td><td><a>W</a></td><td><a>X</a></td><td><a>Y</a></td><td><a>Z</a></td><td><a>其它</a></td>
			</tr>		
		</table>
	</div>
	<div style="margin:0px 5px 15px 0px;">
		<table id="nwlist" name="nwlist" width="99%" cellpadding="0" cellspacing="0" border="0" class="display" >
			<thead>
				<tr>
					<th width="1%">操作</th>
					<th width="1%">ID</th>
					<th width="10%">产品系列</th>
					<th width="15%">SYSOID</th>
					<th width="3%">类别</th>
					<th width="3%">厂商</th>
				</tr>
			</thead>
	</div>
</body>
</html>